<template>
  <div class="saech_filer_box">
    <el-form
      :model="searchForm"
      ref="form"
      label-position="top"
      label-width="auto"
      :inline="false"
      size="small"
    >
      <el-row :gutter="20">
        <el-col :span="24" :offset="0">筛选</el-col>
        <el-col :span="24" :offset="0">
          <el-form-item label="品牌" prop="brand">
            <el-input
              v-model="searchForm.brand"
              placeholder="请输入"
            ></el-input> </el-form-item
        ></el-col>
        <el-col :span="24" :offset="0">
          <el-form-item label="模式" prop="model">
            <el-input
              v-model="searchForm.model"
              placeholder="请输入"
            ></el-input> </el-form-item
        ></el-col>
      </el-row>
    </el-form>
    <div class="search_btns flex-x flex-space">
      <el-button style="width: 49%" class="reset" size="mini" @click="reSet"
        >重置</el-button
      >
      <el-button
        style="width: 49%"
        class="submit"
        size="mini"
        @click="submitForm"
        type="primary"
        >提交</el-button
      >
    </div>
  </div>
</template>

<script>
import { getTemplate } from "@/api/technology";
import _ from "lodash";
export default {
  props: {},
  data() {
    return {
      searchForm: {
        model: "",
        brand: "",
      },
    };
  },
  mounted() {
    this.getTemplate();
  },
  methods: {
    getTemplate() {
      getTemplate({
        page: 1,
        pageSize: 0,
      })
        .then((r) => {
          const { data } = r;

          this.tableData = _.uniqBy(data.results, "author");
        })
        .finally((f) => {});
    },

    //重置
    reSet() {
      this.searchForm = {
        model: "",
        brand: "",
      };
      this.$emit("setFilterList");
    },
    submitForm() {
      if (this.searchForm.brand || this.searchForm.model) {
        this.$emit("setFilterList", this.searchForm);
      } else {
        this.$emit("setFilterList");
      }
    },
  },
};
</script>

<style lang='scss' scoped>
.saech_filer_box {
  position: relative;
  height: 100%;
  /deep/.el-form-item {
    margin-bottom: 10px;
    .el-form-item__label {
      padding-bottom: 0 !important;
    }
  }
  .search_btns {
    width: 100%;
    position: absolute;
    bottom: 0;
    padding: 10px;
    left: 0;
  }
}
</style>